<template>
  <div style="background-color: #ffffff">
    <div style="width: 1100px;margin: 0 auto; padding: 25px 0">
      <div style="text-align: center"><h1 style="padding: 48px 0 32px 0;font-size: 18px">什么是极速退款助手</h1></div>
      <a-row :gutter="40">
        <a-col :span="8" :offset="4">
          <div style="border: 1px #dddddd solid;padding: 16px;border-radius: 8px">
            <div style="font-size: 14px;color:#000;">自动执行极速退款</div>
            <div style="font-size: 14px;margin-top: 16px">系统将自动识别小于300元，且成功下单时间小于6小时的未发货订单，执行极速退款。</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div style="border: 1px #dddddd solid;padding: 16px;border-radius: 8px">
            <div style="font-size: 14px;color:#000;">极速退款标识</div>
            <div style="font-size: 14px;margin-top: 16px">开通后，商品带上“
              <span style="color: rgb(0, 181, 217);background: rgb(240, 255, 255);font-size: 12px;border: 1px #dddddd solid;border-radius: 4px;padding: 2px">极速退款</span>”标识，退款有保障, 买家更放心。</div>
          </div>
        </a-col>
      </a-row>
      <div style="text-align: center"><h1 style="padding: 48px 0 32px 0;font-size: 18px">开通极速退款的优势</h1></div>
      <a-row
        type="flex"
        justify="center"
        align="middle">
        <a-col :span="6" style="text-align: center">
          <img src="@/assets/img/refund1.png" style="width: 100px">
          <div style="font-size: 14px;margin-top: 8px;color: #000000">提高日常处理效率</div>
          <div style="font-size: 12px">有效节省人力成本</div>
        </a-col>
        <a-col :span="6" style="text-align: center">
          <img src="@/assets/img/refund2.png" style="width: 100px">
          <div style="font-size: 14px;margin-top: 8px;color: #000000">极速处理售后服务请求</div>
          <div style="font-size: 12px">高店铺评分带动高转化</div>
        </a-col>
        <a-col :span="6" style="text-align: center">
          <img src="@/assets/img/refund3.png" style="width: 100px">
          <div style="font-size: 14px;margin-top: 8px;color: #000000">自动处理大量退款</div>
          <div style="font-size: 12px">轻松应对爆单</div>
        </a-col>
      </a-row>
      <div style="margin: 40px 100px;border-top: 1px #dddddd solid"></div>
      <div style="text-align: center">
        <a-button type="primary" size="large" style="width: 200px">马上开启</a-button>
        <div style="margin-top: 16px"><a style="font-size: 12px; color: #717273" href="https://school.jinritemai.com/doudian/web/article/101792?from=shop_article" target="_blank">风险说明</a></div>
      </div>
    </div>
    <a-modal v-model="visible" title="Title" on-ok="handleOk">
      <template slot="footer">
        <a-button key="back" @click="handleCancel">
          Return
        </a-button>
        <a-button key="submit" type="primary" :loading="loading" @click="handleOk">
          Submit
        </a-button>
      </template>
      <p>Some contents...</p>
      <p>Some contents...</p>
      <p>Some contents...</p>
      <p>Some contents...</p>
      <p>Some contents...</p>
    </a-modal>
  </div>
</template>

<script>
    export default {
        name: 'RefundHelper'
    }
</script>

<style scoped>

</style>
